Graph API - Facebook Developer Garage Taipei
5 likes11 views
The document discusses the Facebook Graph API, detailing its introduction, functions, and recent updates as of 2010. It emphasizes the transition to using access tokens and canvas iframes for app development, along with the deprecation of FBML. Additionally, it highlights the Open Graph Protocol and other features to enhance app interaction with Facebook's platform.
![...has connections
http://graph.facebook.com/http://www.imdb.com/title/tt0117500?metadata=1
{
"id": "118133258218514",
[...],
"metadata": {
"connections": {
"feed": "http://graph.facebook.com/http://www.imdb.com/title/tt0117500/feed",
"posts": "http://graph.facebook.com/http://www.imdb.com/title/tt0117500/posts",
"tagged": "http://graph.facebook.com/http://www.imdb.com/title/tt0117500/tagged",
"statuses": "http://graph.facebook.com/http://www.imdb.com/title/tt0117500/statuses",
"links": "http://graph.facebook.com/http://www.imdb.com/title/tt0117500/links",
"notes": "http://graph.facebook.com/http://www.imdb.com/title/tt0117500/notes",
"photos": "http://graph.facebook.com/http://www.imdb.com/title/tt0117500/photos",
"albums": "http://graph.facebook.com/http://www.imdb.com/title/tt0117500/albums",
"events": "http://graph.facebook.com/http://www.imdb.com/title/tt0117500/events",
"videos": "http://graph.facebook.com/http://www.imdb.com/title/tt0117500/videos"
}
},
"type": "page"
}](https://image.slidesharecdn.com/graphapiv10-100823040012-phpapp01/85/Graph-API-Facebook-Developer-Garage-Taipei-35-320.jpg)
![Graph API for checkins
Extended permissions:
user_checkins, friend_checkins
https://graph.facebook.com/[user id]/checkins
https://graph.facebook.com/[place page id]/checkins
https://graph.facebook.com/search?type=checkins](https://image.slidesharecdn.com/graphapiv10-100823040012-phpapp01/85/Graph-API-Facebook-Developer-Garage-Taipei-39-320.jpg)
Graph API - Facebook Developer Garage Taipei
- 1. Graph API Facebook Developer Garage Taipei CardinalBlue john, godfat @
- 2. Graph API •What is it? • What to do? • What’s new?
- 3. Graph API: What is it? • Launched at F8 (April 2010) • Simple REST API • Completely new!
- 4. Your apps will fail... soon. APP
- 6. http://graph.facebook.com/hellokitty { "id": "40444963499", "name": "Hello Kitty", "picture": "http://profile.ak.fbcdn.net/hprofile-ak-snc4/ hs625.ash1/27537_40444963499_5441_s.jpg", "link": "http://www.facebook.com/hellokitty", "category": "Public_figures_other", "username": "hellokitty", "affiliation": "Sanrio Inc. USA", "birthday": "11/01/-001", "personal_info": "Hello Kitty's Official Fan Page!nHello Kitty lives in the suburbs of London with her parents and her twin sister Mimmy. She has lots of friends at school with whom she shares many adventures.nHer trademark is her red bow that she always wears over her left ear.nHello Kitty is as heavy as three apples and as tall as five apples.", "personal_interests": "Traveling, listening to music, reading, eating yummy cookies, and making new friends. As Hello Kitty always says, u201cYou can never have too many friends!"nShe collects small, cute objects like ribbons, hair accessories, candy, stars, and goldfish.", "fan_count": 267913, "type": "page" }
- 7. Connections http://graph.facebook.com/hellokitty?metadata=1 "metadata": { "connections": { "feed": "http://graph.facebook.com/hellokitty/feed", "posts": "http://graph.facebook.com/hellokitty/posts", "tagged": "http://graph.facebook.com/hellokitty/tagged", "statuses": "http://graph.facebook.com/hellokitty/statuses", "links": "http://graph.facebook.com/hellokitty/links", "notes": "http://graph.facebook.com/hellokitty/notes", "photos": "http://graph.facebook.com/hellokitty/photos", "albums": "http://graph.facebook.com/hellokitty/albums", "events": "http://graph.facebook.com/hellokitty/events", "videos": "http://graph.facebook.com/hellokitty/videos" } }
- 8. object connection objects
- 9. http://graph.facebook.com/hellokitty/posts { "data": [ { "id": "40444963499_420034668499", "from": { "name": "Hello Kitty", "category": "Public_figures_other", "id": "40444963499" }, "message": "Check out the cute Hello Kitty Nerds tote featured in Us Weekly! Find this and more Hello Kitty u201cNerdsu201d stuff at Sanrio.com and select Sanrio Boutiques.nnhttp://bit.ly/brVYHTn", "picture": "http://photos-h.ak.fbcdn.net/hphotos-ak-ash2/ hs003.ash2/33501_420032663499_40444963499_4947695_6515646_s.jpg", "link": "http://www.facebook.com/photo.php?pid=4947695&fbid=420032663499&id=40444963499", "name": "Nerd Alert!", "caption": "5 new photos", "icon": "http://static.ak.fbcdn.net/rsrc.php/z2E5Y/hash/8as8iqdm.gif", "type": "photo", "created_time": "2010-08-20T01:04:30+0000", "updated_time": "2010-08-20T01:04:30+0000", "likes": 892, "comments": { "count": 76 } }, { "id": "40444963499_419689583499", "from": { "name": "Hello Kitty", "category": "Public_figures_other", "id": "40444963499" }, "message": "Weu2019ve been playing with the Hello Kitty 35 mm Fisheye camera by Lomography and wanted to share some of the fun pictures weu2019ve taken! Has anyone else taken any awesome pictures with their Hello Kitty Fisheye cameras? Post them to our wall, we wanna see them! nnThe Hello Kitty Fisheye Camera is now available at Sanrio.com, select Sanrio Boutiques, Urban Outfitters, Lomography.com and Lomography gallery stores. nnhttp://bit.ly/91unb4n", "picture": "http://photos-f.ak.fbcdn.net/hphotos-ak-snc4/ hs389.snc4/45262_419686073499_40444963499_4941020_5615227_s.jpg", "link": "http://www.facebook.com/photo.php?pid=4941020&fbid=419686073499&id=40444963499", "name": "Fisheye Camera Photos", "icon": "http://static.ak.fbcdn.net/rsrc.php/z2E5Y/hash/8as8iqdm.gif", "type": "photo",
- 10. Most data requires explicit user permission
- 11. Access Token •Obtained when a user gives permissions to a Facebook application •Used for making Graph API calls For testing, try: http://oauth.twoalex.com
- 12. Access Token Usage https://graph.facebook.com/me?access_token=... https://graph.facebook.com/me/feed?access_token=... https://graph.facebook.com/me/likes?access_token=... https://graph.facebook.com/me/friends?access_token= https://graph.facebook.com/4/feed?access_token=... Explore Graph API: http://aiphone1.heroku.com
- 13. How to get an access token • Redirect to OAuth • https://graph.facebook.com/oauth/authorize ... • https://graph.facebook.com/oauth/access_token ... • Javascript SDK • User clicks on login button • SDK stores the access token into a cookie
- 14. Extended Permissions When authenticating, can ask the user for extended permissions: • user_photos, friend_photos • user_likes, friend_likes • read_stream, publish_stream • email • offline_access • and many more....
- 17. Graph API •What is it? • What to do? • What’s new?
- 18. Types of Facebook Apps • Canvas FBML • Canvas iframe • Website • Mobile website • Mobile (native) • Desktop
- 19. Canvas apps • Canvas FBML • Canvas iframe
- 20. Canvas apps • Canvas FBML • Canvas iframe
- 21. Major Changes for Canvas Apps By end of this year (2010): 1. Canvas FBML will be deprecated... you must use Canvas iframe! 2. The Facebook “session_key” will disappear... you must use access_token for API calls! 3. The “fb_sig” parameters will disappear... you must query and cache user data!
- 22. 1. Must use canvas iframe • Many FBML tags not supported in iframe • Use Javascript SDK to get XFBML (which is a subset of FBML tags for iframe apps) <fb:name uid=’4’></fb:name> • After end of 2010, FBML apps cannot be created.
- 23. 2. Must use access token • You need to upgrade your SDK library • All calls to Facebook must be made with an access token: ‣ FQL Query https://api.facebook.com/method/fql.query?query=...&access_token=... ‣ Old REST API calls https://api.facebook.com/method/stream.publish?access_token=... https://api.facebook.com/method/pages.isFan?page_id=...&access_token=...
- 24. Facebook’s PHP SDK http://github.com/facebook/php-sdk/ $me = $facebook->api('/me'); $mark = $facebook->api('/4'); $loginUrl = $facebook->getLoginUrl(); <a href="<?php echo $loginUrl; ?>"> Click to Login </a>
- 26. 3. Must query and cache user data • Instead of many “fb_sig” parameters, Facebook will only pass a signed_request (containing access token and user id) • Many parameters will disappear, so you will need to query and cache them yourself... • fb_sig_friends => https://graph.facebook.com/me/friends?... • fb_sig_locale => https://api.facebook.com/methods/users.getInfo?...
- 28. Types of Facebook Apps Authentication Markup Access Token Canvas FBML FBML signed request Canvas iframe Redirect to OAuth from cookie Javascript (placed by Website SDK XFBML Javascript SDK) Mobile website
- 29. Summary: What to do? • Switch to new SDK • Use new login and get permissions • Convert all FQL queries and Old REST API calls into Graph API calls • Remove any references to fb_sig • For performance, set up caching
- 30. Graph API •What is it? • What to do? • What’s new?
- 31. What’s new? • Open Graph Protocol • Facebook Places API
- 32. anything can be an object http://graph.facebook.com/http://www.facebook.com even an URL!
- 33. not much information though { "id": "http://www.facebook.com", "shares": 666837 }
- 34. but this one... http://graph.facebook.com/http://www.imdb.com/title/tt0117500/ { "id": "114324145263104", "name": "The Rock (1996)", "picture": "http://profile.ak.fbcdn.net/hprofile-ak-snc4/ hs344.snc4/41581_114324145263104_7037_s.jpg", "link": "http://www.imdb.com/title/tt0117500/", "category": "Movie", "description": "Directed by Michael Bay. With Sean Connery, Nicolas Cage, Ed Harris. A group of U.S. marines, under command of a renegade general, take over Alcatraz and threat San Francisco Bay with biological weapons. A chemical weapons specialist and the only man to have ever escaped from the Rock are the only ones who can prevent chaos. Visit IMDb for Photos, Showtimes, Cast, Crew, Reviews, Plot Summary, Comments, Discussions, Taglines, Trailers, Posters, Fan Sites", "fan_count": 931 }
- 35. ...has connections http://graph.facebook.com/http://www.imdb.com/title/tt0117500?metadata=1 { "id": "118133258218514", [...], "metadata": { "connections": { "feed": "http://graph.facebook.com/http://www.imdb.com/title/tt0117500/feed", "posts": "http://graph.facebook.com/http://www.imdb.com/title/tt0117500/posts", "tagged": "http://graph.facebook.com/http://www.imdb.com/title/tt0117500/tagged", "statuses": "http://graph.facebook.com/http://www.imdb.com/title/tt0117500/statuses", "links": "http://graph.facebook.com/http://www.imdb.com/title/tt0117500/links", "notes": "http://graph.facebook.com/http://www.imdb.com/title/tt0117500/notes", "photos": "http://graph.facebook.com/http://www.imdb.com/title/tt0117500/photos", "albums": "http://graph.facebook.com/http://www.imdb.com/title/tt0117500/albums", "events": "http://graph.facebook.com/http://www.imdb.com/title/tt0117500/events", "videos": "http://graph.facebook.com/http://www.imdb.com/title/tt0117500/videos" } }, "type": "page" }
- 36. adding <meta> tag to any web page turns it into a facebook object
- 38. Facebook Places
- 39. Graph API for checkins Extended permissions: user_checkins, friend_checkins https://graph.facebook.com/[user id]/checkins https://graph.facebook.com/[place page id]/checkins https://graph.facebook.com/search?type=checkins
- 40. See where your friends have checked in: http://fbfetcher.heroku.com/ welcome/places
- 41. Graph API • What is it? Simple new REST API with OAuth2.0 • What to do? Rewrite your apps using new SDKs • What’s new? Open Graph, Facebook Places.